<template>
  <div class="callCustomerService">
    <el-tabs v-model="activeName">
      <el-tab-pane :label="one.name"
                   :name="one.value"
                   v-for="(one,index) in menu" :key="index">

      </el-tab-pane>
    </el-tabs>
    <keep-alive>
      <component :is="activeName"
                 class="content"
                 :triggerClick="triggerClick"
      ></component>
    </keep-alive>
  </div>
</template>
<script>
  import CallLabel from '../../config/channelConfig/telCustomerService/callLabel.vue'
  import queueSurveySelect from './labelManageLib/queueSurveySelect.vue'
  import serverLabel from '../../config/channelConfig/telCustomerService/serverLabel.vue'
  import ImportTask from './ImportTask'
  export default {
    name: 'LabelManage',
    data () {
      return {
        activeName: 'CallLabel',
        menu: [
          {name: '通话标签', value: 'CallLabel', id: 'call_config_label'},
          {name: '服务质量标签', value: 'serverLabel', id: 'service_quality_label'},
          {name: '导入任务列表', value: 'ImportTask', id: 'import_label'}
          // {name: '满意度调查选项', value: 'queueSurveySelect'}
        ]
      }
    },
    props: {
      triggerClick: {type: Number, default: 0}
    },
    components: {
      CallLabel,
      queueSurveySelect,
      serverLabel,
      ImportTask
    },
    methods: {
      dealMenu () {
        this.activeName = this.menu[0].value
      }
    },
    beforeMount () {
      this.dealMenu()
    }
  }
</script>

<style lang="stylus" scoped>
  .callCustomerService
    .content
      /*padding 20px*/
      height calc(100vh - 174px)
      overflow scroll
      overflow-x hidden
</style>
